<#include "../../layout.ftl">
<@title>
    <title>字典管理</title>
</@title>
<@css>

</@css>
<@layout>
    <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="searchForm">
                    <div class="select-list">
                        <ul>
                            <li>
                                字典名称：<input type="text" id="name" />
                            </li>
                            <li>
                                字典编码：<input type="text" id="code" />
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" id="searchButton"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" id="resetButton"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>

            <div class="btn-group-sm" id="toolbar" role="group">
                <a class="btn btn-success" onclick="add();" data-role="admin.dict.add">
                    <i class="fa fa-plus"></i> 新增
                </a>
                <a class="btn btn-primary single disabled" onclick="edit(this);" data-id="0" data-role="admin.dict.edit">
                    <i class="fa fa-edit"></i> 修改
                </a>
                <a class="btn btn-danger multiple disabled" onclick="removeAll(this);" data-id="0" data-role="admin.dict.delete">
                    <i class="fa fa-remove"></i> 删除
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="dataTable"></table>
            </div>
        </div>
    </div>
</@layout>

<@js>

    <script layout:fragment="script">
        let $table;
        $(function () {
            loadData();

        });


        function loadData() {
            let options = {
                url: '/admin/dict/getPageList',
                pageNumber: 1,                      // 初始化加载第一页，默认第一页,并记录
                pageSize: 10,                       // 每页的记录行数（*）
                pageList: "10, 25, 50, 100",        // 可供选择的每页的行数（*）
                queryParams: function (params) {
                    let p = {
                        pageNumber: params.pageNumber,
                        pageSize: params.pageSize,
                        dictName: $('#name').val(),
                        dictCode: $('#code').val()
                    }
                    return p;
                },
                columns: [
                    { field: 'selectItem', checkbox: true },
                    {
                        field: 'dicName', title: '字典名称', align: "center", formatter(v, r, i) {
                            return '<a href="javascript:void(0)" onclick="sonList(this);" data-id="' + r.id + '">' + v + '</a>'
                        }
                    },
                    { field: 'dicCode', title: '字典编码', align: "center" },
                    { field: 'sortNum', title: '排序', align: "center" },
                    { field: 'remark', title: '备注', align: "center" },
                    { field: 'createTime', title: '创建时间', align: "center" },
                    {
                        field: 'id', title: '操作', align: "center", formatter: renderOperationButton
                    }
                ]
            };

            $table = $('#dataTable').easyTable(options);
            //$table.easyTable('selectedEvent');
        }

        function renderOperationButton(value, row, index) {
            let actions = [];
            actions.push({
                roleTag: 'system:dic:edit',
                button: '<a class="btn btn-success btn-xs" href="javascript:void(0);" onclick="edit(this);" data-id="' + value + '"><i class="fa fa-edit"></i>编辑</a>'
            });
            actions.push({
                roleTag: 'system:dic:son',
                button: '<a class="btn btn-info btn-xs " href="javascript:void(0)" onclick="sonList(this);" data-id="' + value + '"><i class="fa fa-list-ul"></i>列表</a>'
            })
            actions.push({
                roleTag: 'system:dic:delete',
                button: '<a class="btn btn-danger btn-xs" href="javascript:void(0);" onclick="removeAll(this);" data-id="' + value + '"><i class="fa fa-trash"></i>删除</a>'
            });

            return jutils.buttonPermission(actions);
        }


        function add() {

            jutils.dialog("添加字典项", '/admin/dict/form', { id: 0 }, null, function () {
                $table.easyTable('search');
            });
        }

        function edit(obj) {
            let id = $(obj).data('id');
            if (id == 0) {
                const rows = $table.easyTable("selected");
                if (rows.length == 0) {
                    jutils.warn("请选择数据行");
                    return;
                }
                id = rows[0].id;
            }
            jutils.dialog("修改字典项", '/admin/dict/form', { id: id }, null, function () {
                $table.easyTable('search');
            });
        }

        function removeAll(obj) {
            const id = $(obj).data('id');
            let del = false;
            let ids = [];
            if (id == 0) {
                const rows = $table.easyTable("selected");
                if (rows.length == 0) {
                    jutils.warn("请选择数据行");
                    return;
                }
                for (let i = 0; i < rows.length; i++) {
                    ids.push(rows[i].id);
                }
            } else {
                ids.push(id);
            }


            jutils.confirm("确认删除当前字典和字典数据吗？", function () {
                jutils.ajaxGet("/admin/dict/removeAll", { ids: ids.join() }, function (res) {
                    if (res.status) {
                        $table.easyTable('search');
                    }
                });
            });
        }

        function sonList(obj) {
            const id = $(obj).data('id');
            //console.log(id);
            jutils.openTab("sondict", '字典数据', '/admin/dict/sonView?pid=' + id);
        }

    </script>
</@js>
